import React, { useState, useEffect } from 'react';
import { View, Text, TextInput, StyleSheet, ScrollView ,Image,TouchableOpacity} from 'react-native';
import '../common/global';
import image from './ImagePickerPage'

const Release = ({ navigation, route }) => {
  const m = route.params;
   console.log(m)
  const [inpvalue, setInpvalue] = useState('');
  const [value, setValue] = useState('');

  useEffect(() => {
    navigation.setOptions({  
      headerRight: () => (
        <Text
          style={{ marginRight:ptd(20), marginTop:ptd(10),fontSize: 10 ,backgroundColor:'red',color:'white',paddingTop:3,paddingBottom:3,paddingLeft:10,paddingRight:10,borderRadius:20}}
          title="update"
          onPress={submit}>
          发布
        </Text>
      ),
    });
  }, [inpvalue, value,m]);
  
  const submit = ()=>{
    console.log('kk')
    console.log(inpvalue)
    console.log(value)
    console.log(m.topic)
    let formData = new FormData();
     formData.append("daily_user_id","admin");
     formData.append("daily_content",value);
     formData.append("daily_title,",inpvalue);
     formData.append("post_style_id","king");
    
    fetch('http://10.7.86.204:8080/daily/postdaily' , {
      method: 'POST',
      headers: {
         Accept: 'application/json',
        'Content-Type': 'application/json'
      },
      body: formData,
    }).then((response) => {
      if (response.ok) {
          return response.json();
          navigation.navigate('Home');
      }
    }).then((json) => {
      alert(JSON.stringify(json));
    }).catch((error) => {
      console.error(error);
    });

  }

  return (
    <ScrollView style={{backgroundColor:'white'}}>
      <TouchableOpacity onPress={(i)=>i.choosePic.bind( this )} style={styles.phos}>
        <View>
          <Text style={styles.pho}>+</Text>
        </View>
        <Image source={(i)=>i.state.avatarSource} style={styles.image} />
      </TouchableOpacity>
      <TextInput
          placeholder = {'有标题会被更多的人看到哦~'}
          placeholderTextColor = {'#BBBBBB'}
          style={styles.title}
          value={inpvalue}
          onChangeText={(val) => setInpvalue(val)}
      />
      <View style={styles.content}>
        <TextInput
          placeholder = {'来分享你的备婚经验，帮助姐妹们种草吧！'}
          placeholderTextColor = {'#C2C2C2'}
          multiline={true}
          style={styles.title2}
          value={value}
          
          onChangeText={(val) => setValue(val)}
        />
      </View>

      <View style={styles.about}>      
        <Text>
          <Image style={{width:ptd(18),height:ptd(18),marginTop:ptd(5),float:'left'}} 
            source={require('./img/topic.png')}>   
          </Image>
          <Text style={m==undefined?styles.topic:styles.topic2}>{m==undefined?'参与话题':m.topic}</Text>
          <TouchableOpacity  style={styles.more} 
            onPress={()=>{
                navigation.navigate("topic")
            }} 
          >
            <Text> 更多</Text>
          </TouchableOpacity>
       </Text>
        
      </View>
    </ScrollView>
  );
};
const styles = StyleSheet.create({
  pho:{
    width:ptd(70),
    height:ptd(70),
    fontSize:40,
    opacity:0.6,
    paddingLeft:ptd(18),
    borderColor: 'gray',
    borderWidth: 1,
    borderStyle: 'dashed',
    borderRadius:10,
    
  },
  phos:{
     width:ptd(70),
    height:ptd(70),
    margin:ptd(12)
  },
  title: {
    fontSize: 14,  
    fontWeight:800,   
    marginLeft:ptd(12),
    marginTop:ptd(10)
  },
  content: {
    height: 100,
    margin:ptd(12),
    borderTopColor: '#DEDEDE',
    borderBottomColor: '#DEDEDE',
    borderTopWidth: 1,
    borderBottomWidth: 1,
    borderStyle: 'solid',
  },
  title2: {
    height: 100,
    fontSize: 13,
  },
  about:{
    height:30,
    marginLeft:ptd(8),
    marginRight:ptd(12),
    borderColor: '#DEDEDE',
    // borderTopWidth: 1,
    borderBottomWidth: 1,
    borderStyle: 'solid',
  },
  topic:{
    fontSize:12,
    fontWeight:730,
    fontFamily:'黑体',
    width:ptd(70),
    height:ptd(30),
    marginLeft:ptd(5),
    float:'left',
    position:'relative',
    top:ptd(7),
  },
  topic2:{
    fontSize:12,
    fontWeight:730,
    fontFamily:'微软雅黑',
    // width:ptd(70),
    height:ptd(30),
    color:'#f50f46',
    marginLeft:ptd(5),
    float:'left',
    position:'relative',
    top:ptd(5),
  },
  more:{
    fontSize:8,
    fontFamily:'黑体',
    color:'#BABABA',
    float:'right',
    position:"relative",
    marginRight:ptd(5),
    marginTop:ptd(5)
  }
});
export default Release;
